<template>
    <div class="modal fade" id="confirm">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">确认框</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <div class="modal-body">

                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-primary sure">确定</button>
                    <button type="button" class="btn btn-secondary cancel" data-dismiss="modal">关闭</button>
                </div>

            </div>
        </div>
    </div>
</template>

<script>
    export default {
        mounted() {

        },
        methods:{
            dialog(message, yesCallback, noCallback) {
                if (message) {
                    $('#confirm .modal-body').html(message);
                }
                $('#confirm').modal('show');
                //回调按钮点击事件，加上off('click')，或者用one代替on绑定，否则会出现click事件累加的问题
                $('#confirm .btn.sure').off('click').on('click',function(){
                    $('#confirm').modal('hide');
                    yesCallback();
                });
                $('#confirm .btn.cancel').off('click').on('click',function(){
                    $('#confirm').modal('hide');
                    noCallback();
                });
            }
        }
    }
</script>
